{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Highcharts Demos\n",
    "================\n",
    "Basic area: http://www.highcharts.com/demo/area-basic\n",
    "-----------------------------------------------------"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<iframe style=\"border:0;outline:none;overflow:hidden\" srcdoc=\"&lt;!DOCTYPE html&gt;\n",
       "&lt;html lang=&quot;en&quot;&gt;\n",
       "    &lt;head&gt;\n",
       "        &lt;meta charset=&quot;utf-8&quot; /&gt;\n",
       "        &lt;link href=&quot;https://www.highcharts.com/highslide/highslide.css&quot; rel=&quot;stylesheet&quot; /&gt;\n",
       "        &lt;script type=&quot;text/javascript&quot; src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js&quot;&gt;&lt;/script&gt;\n",
       "        &lt;script type=&quot;text/javascript&quot; src=&quot;https://code.highcharts.com/highcharts.js&quot;&gt;&lt;/script&gt;\n",
       "        &lt;script type=&quot;text/javascript&quot; src=&quot;https://code.highcharts.com/highcharts-more.js&quot;&gt;&lt;/script&gt;\n",
       "        &lt;script type=&quot;text/javascript&quot; src=&quot;https://code.highcharts.com/modules/exporting.js&quot;&gt;&lt;/script&gt;\n",
       "    &lt;/head&gt;\n",
       "    &lt;body style=&quot;margin:0;padding:0&quot;&gt;\n",
       "                &lt;div id=&quot;container&quot; style=&quot;width:750px;height:600px;&quot;&gt;Loading....&lt;/div&gt;\n",
       "\n",
       "\n",
       "    &lt;script&gt;\n",
       "        $(function(){\n",
       "\n",
       "\n",
       " \n",
       "\n",
       "\n",
       "\n",
       "\n",
       "            Highcharts.setOptions({&quot;lang&quot;: {}, &quot;global&quot;: {}});\n",
       "            var option = {&quot;loading&quot;: {}, &quot;subtitle&quot;: {&quot;text&quot;: &quot;Source: &lt;a href=\\&quot;http://thebulletin.metapress.com/content/c4120650912x74k7/fulltext.pdf\\&quot;&gt;thebulletin.metapress.com&lt;/a&gt;&quot;}, &quot;xAxis&quot;: {&quot;labels&quot;: {&quot;formatter&quot;: function () {                                 return this.value;                             }}, &quot;allowDecimals&quot;: false}, &quot;title&quot;: {&quot;text&quot;: &quot;US and USSR nuclear stockpiles&quot;}, &quot;series&quot;: {}, &quot;labels&quot;: {}, &quot;yAxis&quot;: {&quot;labels&quot;: {&quot;formatter&quot;: function () {                                 return this.value / 1000 + &#x27;k&#x27;;                             }}, &quot;title&quot;: {&quot;text&quot;: &quot;Nuclear weapon states&quot;}}, &quot;chart&quot;: {&quot;width&quot;: 750, &quot;renderTo&quot;: &quot;container&quot;, &quot;height&quot;: 600}, &quot;tooltip&quot;: {&quot;pointFormat&quot;: &quot;{series.name} produced &lt;b&gt;{point.y:,.0f}&lt;/b&gt;&lt;br/&gt;warheads in {point.x}&quot;}, &quot;plotOptions&quot;: {&quot;area&quot;: {&quot;pointStart&quot;: 1940, &quot;marker&quot;: {&quot;states&quot;: {&quot;hover&quot;: {&quot;enabled&quot;: true}}, &quot;radius&quot;: 2, &quot;symbol&quot;: &quot;circle&quot;, &quot;enabled&quot;: false}}}, &quot;credits&quot;: {&quot;enabled&quot;: false}, &quot;colors&quot;: {}, &quot;pane&quot;: {}, &quot;exporting&quot;: {}, &quot;drilldown&quot;: {}, &quot;navigation&quot;: {}, &quot;legend&quot;: {}};\n",
       "\n",
       "\n",
       "            var data = [{&quot;data&quot;: [null, null, null, null, null, 6, 11, 32, 110, 235, 369, 640, 1005, 1436, 2063, 3057, 4618, 6444, 9822, 15468, 20434, 24126, 27387, 29459, 31056, 31982, 32040, 31233, 29224, 27342, 26662, 26956, 27912, 28999, 28965, 27826, 25579, 25722, 24826, 24605, 24304, 23464, 23708, 24099, 24357, 24237, 24401, 24344, 23586, 22380, 21004, 17287, 14747, 13076, 12555, 12144, 11009, 10950, 10871, 10824, 10577, 10527, 10475, 10421, 10358, 10295, 10104], &quot;type&quot;: &quot;area&quot;, &quot;name&quot;: &quot;USA&quot;}, {&quot;data&quot;: [null, null, null, null, null, null, null, null, null, null, 5, 25, 50, 120, 150, 200, 426, 660, 869, 1060, 1605, 2471, 3322, 4238, 5221, 6129, 7089, 8339, 9399, 10538, 11643, 13092, 14478, 15915, 17385, 19055, 21205, 23044, 25393, 27935, 30062, 32049, 33952, 35804, 37431, 39197, 45000, 43000, 41000, 39000, 37000, 35000, 33000, 31000, 29000, 27000, 25000, 24000, 23000, 22000, 21000, 20000, 19000, 18000, 18000, 17000, 16000], &quot;type&quot;: &quot;area&quot;, &quot;name&quot;: &quot;USSR/Russia&quot;}]\n",
       "            option.series = data;\n",
       "\n",
       " \n",
       "\n",
       "            var chart = new Highcharts.Chart(option);\n",
       "\n",
       "\n",
       "\n",
       "\n",
       "\n",
       " \n",
       "\n",
       "\n",
       "        \n",
       "    });\n",
       "        &lt;/script&gt;\n",
       "\n",
       "    &lt;/body&gt;\n",
       "&lt;/html&gt;\" height=600 width=750></iframe>"
      ],
      "text/plain": [
       "<highcharts.highcharts.highcharts.Highchart at 0x7fcdb4207050>"
      ]
     },
     "execution_count": 1,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "from highcharts import Highchart\n",
    "H = Highchart(width=750, height=600) # the size of chart can be set here\n",
    "\n",
    "options = {\n",
    "    'title': {\n",
    "        'text': 'US and USSR nuclear stockpiles'\n",
    "    },\n",
    "    'subtitle': {\n",
    "        'text': 'Source: <a href=\"http://thebulletin.metapress.com/content/c4120650912x74k7/fulltext.pdf\">' +\n",
    "            'thebulletin.metapress.com</a>'\n",
    "    },\n",
    "    'xAxis': {\n",
    "        'allowDecimals': False,\n",
    "        'labels': {\n",
    "            'formatter': 'function () { \\\n",
    "                                return this.value; \\\n",
    "                            }'\n",
    "        }\n",
    "    },\n",
    "    'yAxis': {\n",
    "        'title': {\n",
    "            'text': 'Nuclear weapon states'\n",
    "        },\n",
    "        'labels': {\n",
    "            'formatter': \"function () { \\\n",
    "                                return this.value / 1000 + 'k'; \\\n",
    "                            }\"\n",
    "        }\n",
    "    },\n",
    "    'tooltip': {\n",
    "        'pointFormat': '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'\n",
    "    },\n",
    "    'plotOptions': {\n",
    "        'area': {\n",
    "            'pointStart': 1940,\n",
    "            'marker': {\n",
    "                'enabled': False,\n",
    "                'symbol': 'circle',\n",
    "                'radius': 2,\n",
    "                'states': {\n",
    "                    'hover': {\n",
    "                        'enabled': True\n",
    "                    }\n",
    "                }\n",
    "            }\n",
    "        }\n",
    "    },\n",
    "}\n",
    "\n",
    "H.set_dict_options(options)\n",
    "\n",
    "\n",
    "data1 = [None, None, None, None, None, 6, 11, 32, 110, 235, 369, 640,\n",
    "                1005, 1436, 2063, 3057, 4618, 6444, 9822, 15468, 20434, 24126,\n",
    "                27387, 29459, 31056, 31982, 32040, 31233, 29224, 27342, 26662,\n",
    "                26956, 27912, 28999, 28965, 27826, 25579, 25722, 24826, 24605,\n",
    "                24304, 23464, 23708, 24099, 24357, 24237, 24401, 24344, 23586,\n",
    "                22380, 21004, 17287, 14747, 13076, 12555, 12144, 11009, 10950,\n",
    "                10871, 10824, 10577, 10527, 10475, 10421, 10358, 10295, 10104]\n",
    "\n",
    "data2 = [None, None, None, None, None, None, None, None, None, None,\n",
    "                5, 25, 50, 120, 150, 200, 426, 660, 869, 1060, 1605, 2471, 3322,\n",
    "                4238, 5221, 6129, 7089, 8339, 9399, 10538, 11643, 13092, 14478,\n",
    "                15915, 17385, 19055, 21205, 23044, 25393, 27935, 30062, 32049,\n",
    "                33952, 35804, 37431, 39197, 45000, 43000, 41000, 39000, 37000,\n",
    "                35000, 33000, 31000, 29000, 27000, 25000, 24000, 23000, 22000,\n",
    "                21000, 20000, 19000, 18000, 18000, 17000, 16000]\n",
    "\n",
    "\n",
    "H.add_data_set(data1, 'area', 'USA', )\n",
    "H.add_data_set(data2, 'area', 'USSR/Russia')\n",
    "\n",
    "H"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 2",
   "language": "python",
   "name": "python2"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 2
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython2",
   "version": "2.7.6"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}
